﻿<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>广绣圈</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
	<link rel="stylesheet" href="css/base.css">
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<link rel="stylesheet" href="css/forum.css">	
</head>
<body>
	<!-- 主体 -->
	<div id="gx_layout">
		<!-- 头部 -->
		<header id="gx_header">
			<div class="container">
				<div class="con_top">
					<div class="con_top_box">
						<!-- logo -->
						<div id="logo">
							<a href="#"><img src="./images/logo.png" alt=""></a>
						</div>
						<!-- 导航 -->
						<div id="daohang">
							<ul class="dh_ul clearfix">
								<li><a href="index.html">首页</a></li>
								<li><a href="history.html">发展历程</a></li>
								<li><a href="feature.html">艺术特点</a></li>
								<li>
									<a href="representative.html">代表人物</a>
								</li>
								<li><a href="meaning.html">传承意义</a></li>
								<li><a href="forum.html">广绣圈</a></li>
							</ul>
							<div id="daibiao">
								<div><a href="representative.html#csf">陈少芳</a></div>
								<div><a href="representative.html#xcg">许炽光</a></div>
								<div><a href="representative.html#lgk">梁桂开</a></div>
								<div><a href="representative.html#llq">陆柳卿</a></div>
							</div>
						</div>
					</div>
				</div>
				<div class="inner-banner"></div>
			</div>
		</header>
		<section id="ly_content">
			<div class="container">
				<div id="tabs">
			        <ul class="clearfix">
			          <li class="f_left"><a href="#">留言板</a></li>
			          <li class="f_left"><a href="#">作品赏析</a></li>
			          <li class="f_left"><a href="#">相关文章</a></li>
			        </ul>
			        <div id="tabs-1">
			            <table width="761" border="0" align="center" cellpadding="0" cellspacing="0" bordercolor="#FEFEFE" bgcolor="#FFFFFF">
						  <form action=""  method="post" name="form1" id="form1">
						    <tr>
						      <td width="761" align="center" bgcolor="#F9F8EF"><table width="749" border="0" align="center" cellpadding="0"  cellspacing="0"  style="BORDER-COLLAPSE: collapse">
						        <tr>
						          <td width="749" height="57" background="images/a_03.jpg">&nbsp;&nbsp;</td>
						        </tr>
						        <tr>
						          <td height="36" colspan="3" align="left" background="images/a_05.jpg" bgcolor="#F9F8EF" scope="col">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;姓&nbsp;&nbsp;名：
						            <input title="姓名长度在1~15个字符之间"  name="username" id="username" value=" " maxlength="64" type="text" onblur="checkUserName()" /><span class="tip"></span>
						                </td>
						        </tr>
						        <tr>
						          <td height="36" colspan="3" align="left" background="images/a_05.jpg" bgcolor="#F9F8EF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;标&nbsp;&nbsp;题：
						            <input title="标题长度在1~20个字符之间" id="title" maxlength="64" size="30" name="title"  type="text" onblur="checkTitle()"/><span class="tip"></span>
						                </td>
						        </tr>
						        <tr>
						          <td height="126" colspan="3" align="left" background="images/a_05.jpg" bgcolor="#F9F8EF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;内&nbsp;&nbsp;容：
						            <textarea title="内容长度在140个字符以内" name="content" cols="60" rows="8" id="content" style="background:#fff" onblur="checkContent()"></textarea><span class="tip"></span>
						               
										 <table width="734" border="0" align="center" cellpadding="0" cellspacing="0">
						            <tr>
						              <td width="703" height="40" align="center"><input name="button" type="button" id="button" value="填写留言"/>
						            </tr>
						        </table>
										</td>
						        </tr>						       						      
						        <tr>
						          <td height="35" background="images/a_07.jpg">&nbsp;&nbsp;</td>
						        </tr>
						      </table>
							  
							  </td>
						    </tr>
						    </form>
						  </table>

							<div class="dhead"></div>
							<div id="ddiv" class="clearfix">
								<div class='dcon clearfix'>
									<img class='dpic' src='./images/t1.png'>
									<div class='dword'>
									标题：热爱传统文化<br/>
									用户名：热爱传统文化市民<br/>
									留言内容：当绣片缓缓展开的一刹那，仿佛释放出神奇的魔力，所有人都醉了。</div>
									<div class='dtime'>1-4</div>
								</div>
								<div class='dcon clearfix'>
									<img class='dpic' src='./images/t2.png'>
									<div class='dword'>
									标题：广绣历史源远流长<br/>
									用户名：爱古风的妹子<br/>
									留言内容：广绣始于唐朝，流传至今已有一千多年的历史。</div>
									<div class='dtime'>1-4</div>
								</div>
							</div>
							<div class="dfoot"></div>
			        </div>
			        <div id="tabs-2">
			            <!-- 瀑布流 -->
						<section class = "gallery">
						   <div>
						     <a href="img/2-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/2-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-3.jpg" alt="First image">
						     </a>
						   </div>
						   <div>
						        <a href="img/2-4.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-4.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/4-1.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-1.jpg" alt="First image">
						    </a>
						   </div>

						     <div>
						     <a href="img/4-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						     <div>
						     <a href="img/4-4.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-4.jpg" alt="First image">
						    </a>
						   </div>
						    <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						 <div>
						     <a href="img/2-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/2-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-3.jpg" alt="First image">
						     </a>
						   </div>
						   <div>
						        <a href="img/2-4.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-4.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/4-1.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-1.jpg" alt="First image">
						    </a>
						   </div>

						     <div>
						     <a href="img/4-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						     <div>
						     <a href="img/4-4.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-4.jpg" alt="First image">
						    </a>
						   </div>
						    <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						 <div>
						     <a href="img/2-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/2-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-3.jpg" alt="First image">
						     </a>
						   </div>
						   <div>
						        <a href="img/2-4.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-4.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/4-1.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-1.jpg" alt="First image">
						    </a>
						   </div>

						     <div>
						     <a href="img/4-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						     <div>
						     <a href="img/4-4.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-4.jpg" alt="First image">
						    </a>
						   </div>
						    <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						     <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/2-2.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-2.jpg" alt="First image">
						    </a>
						   </div>
						   <div>
						     <a href="img/2-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/2-3.jpg" alt="First image">
						     </a>
						   </div>

						       <div>
						       <a href="img/4-3.jpg" data-caption="广绣">
						        <img src="img/thumbs/4-3.jpg" alt="First image">
						    </a>
						   </div>  
						</section>
			        </div>
			        <div id="tabs-3">
			        	<table>
					 		<tr>
					 			<td>标题</td>
					 			<td>作者</td>
					 			<td class="m">操作</td>
					 		</tr>
					 		<tr class="display">
						      <td></td>
						      <td></td>
						      <td class="m">
						        <input type="button" value="查看"/>
						        <input type="button" value="修改"/>
						        <input type="button" value="删除"/>        
						      </td>
						    </tr>
					 		<tr>
					 			<td><a href="#">广绣：艰难的复兴之路</a></td>
					 			<td><a href="#">文化之秀</a></td>
					 			<td class="m">
						        	<input type="button" value="查看"/>
						 			<input type="button" value="修改"/>
						 			<input type="button" value="删除"/>        
					 			</td>
					 		</tr>
					 		<tr>
					 			<td><a href="#">广绣的百年幽香</a></td>
					 			<td><a href="#">传承者</a></td>
					 			<td class="m">
					 				<input type="button" value="查看"/>
					        		<input type="button" value="修改"/>
					 				<input type="button" value="删除"/>
					 			</td>
					 		</tr>
						    <tr>
						      <td><a href="#">【寻美岭南】广绣</a></td>
						      <td><a href="#">岭南之花</a></td>
						      <td class="m">
						        <input type="button" value="查看"/>
						        <input type="button" value="修改"/>
						        <input type="button" value="删除"/>
						      </td>
						    </tr>
						    <tr>
						      <td><a href="#">广绣行业中的“花佬”，一个已经消失的称谓</a></td>
						      <td><a href="#">最美广绣</a></td>
						      <td class="m">
						        <input type="button" value="查看"/>
						        <input type="button" value="修改"/>
						        <input type="button" value="删除"/>
						      </td>
						    </tr>
					 		<tr class="m">
					 			<td><input id="art_title"/></td>
					 			<td><input id="art_writer"/></td>
					 			<td><input type="button" value="增加"/></td>
					 		</tr>    
					 	</table>
					 	<button id="manage">管理</button>
					 	<div id="bg1" class="login">
					    <form name="myForm">
					    	<p>管理员登录</p>
					        用户名：<input type="text" name="myName"/>
					        <span id="myDiv"></span><br/>
					        密　码：<input type="password" name="myPwd"/>
					        <span id="myPwd"></span><br/><br/>
					        <input type="button" value=" 登录 " name="submitButton"/>
					        <input type="button" value=" 取消 " name="submitButton2"/>
					    </form>
						</div>	
					  <div class="popDiv">
					      <p><strong>标题:</strong><span></span></p>
					      <p><strong>作者:</strong><span></span></p>   
					      <a href="#" class="close">关闭</a>
					  </div>			        	 
			        </div>
			    </div>
			    			
			</div>
		</section>		
		<footer>
			<p>Copyright ©广东农工商职业技术学院</p>
			<p>20175533124</p>
			<p>李嘉慧</p>
		</footer>	
	</div>
</body>
<!-- 图片欣赏插件-->
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
<script type="text/javascript" src="js/forum.js"></script>
<link rel="stylesheet" href="css/baguetteBox.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/baguetteBox.js"></script>
<script>
// 图片欣赏
 baguetteBox.run('.gallery', {
  // 配置参数
  buttons:Boolean,//是否显示导航按钮。
  noScrollbars:true,//是否在显示时隐藏滚动条。
  titleTag:true,//是否使用图片上的title属性作为图片标题
  async:false,//是否异步加载文件。

  afterShow:function(){//显示遮罩层之后的回调函数。   
       $(".pressing").fadeIn();
    },
  afterHide:function(){//隐藏遮罩层之后的回调函数。 
      $(".pressing").fadeOut(); 
    }
  //preload:5 预加载多少个文件。
  // onChange: function(currentIndex, imagesCount){} 图片改变时的回调函数 
  // overlayBackgroundColor:'rgba(0,0,0,0.8)' 遮罩层的背景颜色
});
</script>
</html>